<template>
	<view>
		<view class="page" v-if="userArray.length == 0"> 暂无商家  </view>
		<view class="page">
			<view class="cu-list menu-avatar" v-for="(item, index) in userArray" :key="index">

				<view>
					{{item.Sp_material.urlJson[0].upload_percent}}
				</view>

				<view class="cu-item">
					<view class="" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10001.jpg);">

					</view>
					<view class="content">
						<view class="text-grey">{{item.Sp_material.name}}</view>
						<view class="text-gray text-sm flex">
							<!-- <view class="text-cut">
								<text class="cuIcon-infofill text-red  margin-right-xs"></text>
								{{item.Sp_material.dianbu_des}}
							</view>  -->
						</view>
					</view>
					<view class="action" @tap="ruzhu(item.Sp_material)">
						详情
						<!-- <view class="text-grey text-xs">{{item.Sp_dianbu.dianbu_user}}</view>
						<view class="cu-tag round bg-grey sm">5</view> -->
					</view>
				</view>
			</view>
			<!-- <view class="padding flex flex-direction">
				<button class="cu-btn bg-red margin-tb-sm lg" @tap="goDianPu">嫣红</button>
			</view> -->
		</view>			
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userArray : []
			};
		},
		async onLoad(e) {
			let data = await this.$httpApi.query({
				"[]": {
					"Sp_material": {
						
					}
				}
			});
			console.log(data)
			//  data['[]']   等价于  data.[]   // [] 是特殊字符报错必须用这种形式。
			this.userArray = data['[]'] ; 
		},
		methods: {

			ruzhu: function(dianbu) {
				// 从vuex获取用户信息
				let userInfo = this.$store.state.user;
				if( userInfo.id ){
					userInfo.dianbu_id = dianbu.id;
					this.$httpApi.update("Sp_user", userInfo);
					this.switchTab('/pages/index/index' , '入驻店铺成功.');
				}else{
					this.navigateTo('/pages/login/login' , '还未登陆.');
				}
				
				
			}
		}
	}
</script>

<style>
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}
	
	.page {
		height: 100Vh;
		width: 100vw;
	}
	
	.page.show {
		overflow: hidden;
	}
	
	.switch-sex::after {
		content: "\e716";
	}
	
	.switch-sex::before {
		content: "\e7a9";
	}
	
	.switch-music::after {
		content: "\e66a";
	}
	
	.switch-music::before {
		content: "\e6db";
	}
</style>
